<template>
    <div class="achievementList">
        <!-- {{list}} -->
        <ul>
            <li class="achievementLists" v-for="(item,index) in list" :key="index">
                <div style="color:#333333;font-size:15px;line-height:3em">
                    <span>{{item.week}}</span>
                    <span style="float:right">合计：<span style="color:#FF4C50">{{Number(item.allMoney).toFixed(2)}}</span>元</span>
                </div>
                <ul>
                    <li v-for="(item1,index1) in item.user_list" :key="index1" style="overflow:hidden;margin-bottom:20px">
                        <div class="achievementDetailMsg">
                            <span><img :src="item1.head_ico" alt=""></span>
                            <div style="margin-left:7px">
                                <span style="font-size:13px;line-height:2em;color:#333333">{{item1.user_name}}</span>
                                <span style="font-size:12px;color:#666666">{{item1.order_time}}</span>
                            </div>
                        </div>
                        <div class="achievementDetailTicheng">
                            <p style="font-size:13px;line-height: 2em;color:#333333">提成：<span style="color:#FF4C50">{{item1.extract_money}}</span>元</p>
                            <p style="font-size:12px;color:#666666">消费：{{item1.order_money}}元</p>
                        </div>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
</template>
<script>
    export default {
        name: "achievementList",
        components:{  
        },
        data() {
            return {
                month:'',
                monthList:[1,2,3,4,5,6,7,8,9,10,11,12],
                yearList:[2017,2018,2019,2020,2021,2022,2023,2024,2025,2026,2027,2028,2029,2030]
            };
        },
        props:['list'],
        methods:{
            cusButtonChange:function(is_effective){
                this.$emit('cusButtonChange',is_effective)
            }
        },
        created(){
        },
        mounted(){
            this.month=(new Date).getMonth()+1
        }
    }
</script>
<style scoped lang="scss">    
    .achievementList{
    .achievementLists{
        width: 92vw;
        margin: 0 auto;
    }
    .achievementDetailMsg{
        float: left;
        >span{
            width:45px;
            height: 45px;
            border-radius: 50%;
            overflow: hidden;
            display: inline-block;
            vertical-align: middle;
            img{
                width: 100%;
                height: 100%;
            }
        }
        >div{
            display: inline-block;
            vertical-align: middle;
            span{
                display: block;
            }
        }
    }
    .achievementDetailTicheng{
        float:right;
    }
}
</style>
